import { ref, computed } from 'vue'

/**
 * 计数器 Hook
 * 
 * @param {number} initialValue - 初始值，默认 0
 * @param {number} min - 最小值，默认 -Infinity
 * @param {number} max - 最大值，默认 Infinity
 * @param {number} step - 步长，默认 1
 * 
 * @returns {object} 返回计数器相关方法和状态
 * @returns {Ref<number>} returns.count - 当前计数值
 * @returns {ComputedRef<boolean>} returns.isMin - 是否达到最小值
 * @returns {ComputedRef<boolean>} returns.isMax - 是否达到最大值
 * @returns {function} returns.increment - 递增方法
 * @returns {function} returns.decrement - 递减方法
 * @returns {function} returns.reset - 重置方法
 * @returns {function} returns.setValue - 设置指定值方法
 * 
 * @example
 * // 基础用法
 * const { count, increment, decrement, reset } = useCounter()
 * 
 * // 带参数用法
 * const { count, isMin, isMax, increment, decrement } = useCounter(10, 0, 100, 5)
 * 
 * // 在模板中使用
 * <template>
 *   <div>
 *     <p>当前值: {{ count }}</p>
 *     <button @click="increment" :disabled="isMax">+</button>
 *     <button @click="decrement" :disabled="isMin">-</button>
 *     <button @click="reset">重置</button>
 *   </div>
 * </template>
 */
export function useCounter(initialValue = 0, min = -Infinity, max = Infinity, step = 1) {
  const count = ref(initialValue)
  
  const isMin = computed(() => count.value <= min)
  const isMax = computed(() => count.value >= max)
  
  function increment() {
    if (!isMax.value) {
      count.value = Math.min(count.value + step, max)
    }
  }
  
  function decrement() {
    if (!isMin.value) {
      count.value = Math.max(count.value - step, min)
    }
  }
  
  function reset() {
    count.value = initialValue
  }
  
  function setValue(value) {
    count.value = Math.max(min, Math.min(value, max))
  }
  
  // 调试信息
  console.log('useCounter created:', { initialValue, min, max, step, count: count.value, isMax: isMax.value })
  
  return {
    count,
    isMin,
    isMax,
    increment,
    decrement,
    reset,
    setValue
  }
} 